@import "./vars.scss";

#myInfo {
  height: 100%;
  display: flex;
  flex-direction: column;
  .head {
    display: flex;
    flex-direction: column;
    background: url(http://p2ebqp10o.bkt.clouddn.com/bg.jpg) no-repeat;
    background-size: cover;
    position: relative;
    box-shadow: 0 0 10px 0;
    > img.header {
      margin: 40px auto 0 auto;
      border: 2px solid white;
      border-radius: 50%;
      width: 1.48rem;
      height: 1.48rem;
    }
    > span {
      &.name {
        font-size: 0.3rem;
        padding: .2rem 0;
      }
      &.balance {
        font-size: 0.25rem;
        padding: .1rem 0;
        color: gold;
        background-color: rgba(0, 0, 0, .1);
      }
      text-align: center;
      font-weight: bold;
      color: #fff;
      text-overflow: ellipsis;
    }
    .signinBtn {
      font-size: 14px;
      height: 0px;
      position: absolute;
      right: 7px;
      min-height: 22px;
      line-height: 22px;
    }
    .live{
        font-size: 14px;
        height: 25px;
        position: absolute;
        right: 10px;
        bottom: 10px;
        min-height: 25px;
        line-height: 25px; 
    }
  }
  .bodyer {
    flex: 1;
    padding-top: 30px;
    p {
      &.love {
        font-size: .4rem;
        color: gray;
      }
      text-align: left;
      padding-left: .2rem;
    }
    .list + .list {
      margin-top: 20px;
    }

    div.video-list {
      display: flex;
      justify-content: space-between;
      flex-wrap: nowrap;
      overflow-x: scroll;
      overflow-y: hidden;
      min-height: $minVideoHeight;

      div + div {
        margin-left: 10px;
      }
      p.back-tip {
        font-size: .4rem;
        color: #ccc;
        width: 100%;
        text-align: center;
        line-height: $minVideoHeight;
      }
    }
  }
}

.disbale-btn {
  background-color: rgb(204, 204, 204) !important;
}
